var OrderBackup = function () {
  var template = /* html */ `
    <div class="order-backup" v-loading.fullscreen.lock="loading">
      <search-btn-view btn-text="查询记录" @before-open="resetSearch" @search="searchData">
        <div slot="search-content">
          <sys-common-search request-url="materialSelectFilter/getMaterialSelectData" :request-data="{type:15}"
            :search="search" :search-field="searchField" label-width="100px" input-width="200px">
            <template slot="append">
              <el-form-item label="状态">
                <el-select clearable v-model="search.isApproval" style="width:200px">
                  <el-option v-for="status in statusList" :key="'status_'+status.value" :value="status.value" :label="status.label">
                  </el-option>
                </el-select>
              </el-form-item>
            </template>
          </sys-common-search>
        </div>
      </search-btn-view>
      <div class="order-backup-table-div">
        <el-table fit stripe border :data="orderList" style="width:100%;" height="parent">
          <el-table-column :resizable="false" label="操作" min-width="150px" align="center">
            <template slot-scope="scope">
              <div v-if="scope.row.isApproval===0&&scope.row.canApproval===1">
                <el-button type="primary" size="mini" @click="approvalOrder(scope.row)">审核</el-button>
                <el-button type="danger" size="mini" @click="retreatOrder(scope.row)">退回</el-button>
              </div>
            </template>
          </el-table-column>
          <el-table-column :resizable="false" prop="status" label="状态" width="80px" align="center">
            <template slot-scope="scope">
              <span>{{i18n.getMsg('feddingBill.approvalStatus.'+scope.row.isApproval)}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="orderId" label="订单编号" min-width="140px" header-align="center"></el-table-column>
          <el-table-column :resizable="false" prop="lineNo" label="订单序号" width="75px" align="center">
            <template slot-scope="scope">
              <span>{{scope.row.lineNo===-1?globalConfig.orderDefaultRowIndex:scope.row.lineNo}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="materialType" label="物料类型" min-width="130px" header-align="center">
          </el-table-column>
          <el-table-column prop="materialFactory" label="仓位" width="80px" align="center">
            <template slot-scope="scope">
              <span>{{scope.row.materialFactory === 1 ? "原材料仓" : "辅料仓"}}</span>
            </template>
          </el-table-column>
          <el-table-column label="原物料" header-align="center">
            <el-table-column prop="oldMaterailModel" label="规格" min-width="120px" header-align="center"></el-table-column>
            <el-table-column prop="oldColor" label="编号" min-width="100px" header-align="center"></el-table-column>
            <el-table-column prop="oldColorDescription" label="描述" min-width="120px" header-align="center"></el-table-column>
          </el-table-column>
          <el-table-column label="改后物料" header-align="center">
            <el-table-column prop="materialModel" label="规格" min-width="120px" header-align="center"></el-table-column>
            <el-table-column prop="color" label="编号" min-width="100px" header-align="center"></el-table-column>
            <el-table-column prop="colorDescription" label="描述" min-width="120px" header-align="center"></el-table-column>
          </el-table-column>
        </el-table>
      </div>

      <table-pagination v-if="pagination.totalCount!==0" :pagination="pagination" @change="pageChange"></table-pagination>
    </div>
  `;

  return {
    mixins: [
      tablePaginationMixin()
    ],

    data: function () {
      var search = {
        orderId: '',
        companyOrderId: '',
        factoryNo: '',
        customerNo: '',
        isApproval: ''
      };
      return {
        loading: false,
        search: _.cloneDeep(search),
        oldSearch: _.cloneDeep(search),
        searchField: ['orderId', 'companyOrderId', 'factoryNo', 'customerNo'],
        statusList: i18n.getDropDown('feddingBill.status', [1, 0]),
        orderList: [],
        i18n: i18n
      };
    },

    created: function () {
      this.setOrderList(true);
    },

    methods: {
      setOrderList: function (isSearch) {
        if (!isSearch) {
          this.search = _.cloneDeep(this.oldSearch);
        }

        var pagination = this.pagination;
        var pageSize = pagination.pageSize;
        var start = (pagination.currentPage - 1) * pageSize;
        var postData = {
          start: start,
          length: pageSize
        };

        var search = this.search;
        var fields = ['orderId', 'companyOrderId', 'factoryNo', 'customerNo', 'isApproval'];
        SysUtil.setPostData(postData, search, fields);

        this.loading = true;
        var self = this;
        ajaxRequest('duplicateOrderUpdateRecords/getDuplicateOrderUpdateRecordsList', postData).then(function (res) {
          if (isSearch) {
            self.oldSearch = _.cloneDeep(self.search);
          }

          var orderList = res.returnData;
          self.orderList = orderList;
          self.pagination.totalCount = res.iTotalRecords;
          self.loading = false;
        }).catch(function () {
          self.loading = false;
        });
      },

      resetSearch: function () {
        this.search = _.cloneDeep(this.oldSearch);
      },

      searchData: function () {
        this.pagination.currentPage = 1;
        this.setOrderList(true);
      },

      pageChange: function () {
        this.setOrderList();
      },

      approvalOrder: function (order) {
        var self = this;
        this.loading = true;
        ajaxRequest("duplicateOrderUpdateRecords/approvalDuplicateOrder", {
          status: 1,
          id: order.id
        }).then(function () {
          self.loading = false;
          self.$alert("审核成功", "信息", {
            callback: function () {
              self.setOrderList();
            }
          });
        }).catch(function () {
          self.loading = false;
        });
      },

      retreatOrder: function (order) {
        var self = this;
        this.loading = true;
        ajaxRequest("duplicateOrderUpdateRecords/deleteDuplicateOrder", {
          id: order.id
        }).then(function () {
          self.loading = false;
          self.$alert("退回成功", "信息", {
            callback: function () {
              self.setOrderList();
            }
          });
        }).catch(function () {
          self.loading = false;
        });
      }
    },

    components: {
      SysCommonSearch: SysCommonSearch,
      SearchBtnView: SearchBtnView
    },

    template: template
  };
}();